<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        .shanghe {
            margin: 0 auto;

        }

        header.header {
            height: 60px;
            border-bottom: 1px solid #ccc;
        }

        header .header-sh {
            position: relative;
            width: 1080px;
            height: 100%;
            line-height: 100%;
            margin: 0 auto;
            /* border: 1px solid #ccc; */
        }

        /* 定位方法 父相子绝*/
        header .header-sh img {
            position: absolute;
            display: block;
        }

        .header-sh img.logo {
            left: 0;
            top: 50%;
            transform: translateY(-50%);
        }

        .header-sh img.search {
            right: 0;
            top: 50%;
            transform: translateY(-50%);
        }

        nav.nav {
            position: relative;
            height: 60px;
            /* border-bottom: 1px solid #ccc; */
            background: url(./images/nav_bg.png) repeat-x center center;
        }

        /* nav.nav {
            border-bottom: 1px solid #ccc;
            box-shadow: 0 -25px 25px 0 #ccc inset;
        } */

        nav ul.nav-list {
            width: 1080px;
            height: 100%;
            /* border: 1px solid #ccc; */
            list-style: none;
            display: flex;
            justify-content: space-around;
            align-items: space-around;
            margin: 0 auto;
            padding-right: 200px;

        }

        nav ul li {
            width: 20%;
            /* border-right: 1px solid #ccc; */
            height: 60px;
            line-height: 60px;
            text-align: center;
            background: url(./images//nav_border.png) repeat-y center center;
            background-position: 100% 0;
        }

        nav ul li a {
            text-decoration: none;
            font-weight: bold;
            color: #000;
        }

        main.main .main-img {
            width: 1080px;
            height: 600px;
            /* border: 1px solid #ccc; */
            margin: 0 auto 20px;
        }

        main.main img {
            width: 100%;
            height: 100%;
        }


        .main-ad {
            width: 100%;
            height: 40px;
            border-bottom: 1px solid #ccc;
            border-top: 1px solid #ccc;
            background-color: #FBFBFB;
        }

        .main-ad .ad-content {
            width: 1080px;
            height: 100%;
            margin: 0 auto;
            /* border: 1px solid #ccc; */
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .main-ad .ad-content h4 {
            font-weight: normal;
        }

        .main-ad .ad-content h4 span {
            font-weight: 700;
        }

        .sh-img {
            width: 1080px;
            height: 300px;
            /* border: 1px solid #ccc; */
            margin: 20px auto 60px;
            display: flex;
            justify-content: space-between;
        }

        .sh-img .new-release {
            width: 30%;
            height: 100%;
            /* background-color: #ccc; */
            margin-right: 10px;
            position: relative;
            border: 1px solid #ccc;

        }

        .sh-img .new-release .header-sec,
        .sh-img .technique .header-sec {
            margin: 10px 0 0 10px;
            height: 10%;
        }


        .sh-img .new-release .header-sec img,
        .sh-img .news-center .header-sec01 img,
        .sh-img .technique .header-sec img {
            margin-right: 5px;
        }

        .sh-img .new-release .header-sec span,
        .sh-img .technique .header-sec span {
            color: #80C464;
            font-weight: bold;
        }

        .sh-img .new-release .img-sec {
            position: relative;
            text-align: center;
            padding-top: 40px;
        }

        .new-release .img-sec .arrow-sec {
            position: absolute;
            width: 100%;
            top: 50%;
            left: 0;
            display: flex;
            justify-content: space-around;
            align-items: space-around;
        }

        .new-release .img-sec .arrow-sec img {
            display: block;
        }

        .img-sec .arrow-sec img:nth-child(1) {
            margin-right: 120px;
        }

        .img-sec .arrow-sec img:nth-child(2) {
            margin-left: 120px;
        }

        .sh-img .news-center {
            width: 50%;
            height: 100%;
            /* background-color: #ccc; */
            margin-right: 10px;
            border: 1px solid #ccc;
        }

        .sh-img .news-center .header-sec01 {
            margin: 10px 0 10px 10px;
            height: 10%;
        }

        .sh-img .news-center .header-sec01 span:nth-child(2) {
            color: #80C464;
            font-weight: bold;
            margin-right: 380px;
        }

        .sh-img .news-center .news-content {
            margin-left: 30px;
            margin-right: 30px;
        }

        .sh-img .news-center .news-content h5 {
            color: red;
            font-size: 16px;
            margin-bottom: 5px;
        }

        .sh-img .news-center .news-content p {
            height: 40px;
            border-bottom: 1px dashed #ccc;
            line-height: 40px;
            color: rgba(0, 0, 0, 0.6);
        }

        .sh-img .news-center .news-content p:nth-child(2) {
            border-top: 1px dashed #ccc;
        }


        .sh-img .technique {
            width: 20%;
            height: 100%;
            border: 1px solid #ccc;
            /* background-color: #ccc; */
        }

        .sh-img .technique .tech-content {
            margin-left: 30px;
        }

        .tech-content p {
            height: 30px;
            line-height: 30px;
            color: rgba(0, 0, 0, 0.6);
        }

        .tech-content p:last-child {
            margin-bottom: 30px;
        }

        .tech-content p>img {
            margin-right: 5px;
        }


        .tech-phone {
            margin-left: 30px;
        }

        .tech-phone span {
            display: block;
            font-size: 10px;
            color: rgba(0, 0, 0, 0.5);
        }

        footer.footer {
            width: 100%;
            height: 300px;
            background-color: #2D2D2D;
        }

        .footer .footer-content {
            position: relative;
            width: 1080px;
            height: 100%;
            margin: 0 auto;
            display: flex;
            justify-content: space-around;
            align-items: space-around;
        }

        .footer .footer-content img {
            display: block;
            position: absolute;
            top: 0;
            right: 0;
        }

        .footer .footer-content dl {
            width: 10%;

        }

        .footer .footer-content dl dt {
            margin: 20px 0;
            color: #fff;
        }

        .footer .footer-content dl dd {
            color: #6F6F6F;
        }

        .footer-bottom {
            width: 100%;
            height: 100px;
            background-color: #2D2D2D;
            border-top: 1px dashed #ccc;
            text-align: center;
        }

        .footer-bottom p {
            margin: 10px;
        }
    </style>
</head>

<body>
    <div class="shanghe">
        <header class="header">
            <div class="header-sh">
                <img class="logo" src="./images/logo.png" alt="">
                <img class="search" src="./images/search.png" alt="">
            </div>
        </header>
        <nav class="nav">
            <ul class="nav-list">
                <li><a href="#">首 页</a></li>
                <li><a href="#">智能手机</a></li>
                <li><a href="#">平板电脑</a></li>
                <li><a href="#">配件</a></li>
                <li><a href="#">服务支持</a></li>
                <li><a href="#">关于尚合</a></li>
            </ul>
        </nav>
        <main class="main">
            <div class="main-img">
                <img src="./images/banner.png" alt="">
            </div>
        </main>
        <div class="main-ad">
            <div class="ad-content">
                <h4><span>最新公告：</span>&nbsp;&nbsp;&nbsp;&nbsp;尚合Aone智能手机入网证已经获工信部门审批下发。尚合官方</h4>
                <img src="./images/share.png" alt="">
            </div>
        </div>
        <div class="sh-img">
            <div class="new-release">
                <div class="header-sec">
                    <img src="./images/jiantou.png" alt="">
                    <span>新品发布</span>
                </div>
                <div class="img-sec">
                    <img class="img01" src="./images/shouji.png" alt="">
                    <div class="arrow-sec">
                        <img src="./images/left_icon.png" alt="">
                        <img src="./images/right_icon.png" alt="">
                    </div>
                </div>
            </div>
            <div class="news-center">
                <div class="header-sec01">
                    <img src="./images/jiantou.png" alt="">
                    <span>新闻中心</span>
                    <span>更多</span>
                </div>
                <div class="news-content">
                    <h5>致歉公告</h5>
                    <p>首批尚合Aonet已全部售馨!</p>
                    <p>【媒体报导】国产高性价比 尚合Aonet四核手机评测</p>
                    <p>我司产品已经通过了国家强制性产品3C认证</p>
                    <p>尚合Aone智能手机入网证已经获工信部门审批下发.</p>
                    <p>我司通过ISO9001:2008国际质量管理体系认证.</p>
                </div>
            </div>
            <div class="technique">
                <div class="header-sec">
                    <img src="./images/jiantou.png" alt="">
                    <span>技术与支持</span>
                </div>
                <div class="tech-content">
                    <p><img src="./images/sbg.png" alt="">售后服务</p>
                    <p><img src="./images/sbg.png" alt="">投诉与建议</p>
                    <p><img src="./images/sbg.png" alt="">联保网点</p>
                    <p><img src="./images/sbg.png" alt="">常见问题FAQ？</p>
                </div>
                <div class="tech-phone">
                    <span>深圳市汇聚众合科技发展有限公司</span>
                    <span>服务热线：400-633-7922</span>
                </div>
            </div>
        </div>
        <footer class="footer">

            <div class="footer-content">
                <img src="./images/top.png" alt="">
                <dl>
                    <dt>尚合首页</dt>
                    <dd>返回首页</dd>
                </dl>
                <dl>
                    <dt>智能手机</dt>
                    <dd>Aone-T</dd>
                    <dd>Aone</dd>
                </dl>
                <dl>
                    <dt>平板电脑</dt>
                    <dd>尚PAD S200</dd>
                    <dd>尚PAD S100</dd>
                    <dd>尚PAD SH-Q7</dd>
                    <dd>尚PAD SH-Q5</dd>
                </dl>
                <dl>
                    <dt>配件中心</dt>
                    <dd>Aone 智能手机</dd>
                </dl>
                <dl>
                    <dt>服务与支持</dt>
                    <dd>售后服务</dd>
                    <dd>投诉与建议</dd>
                    <dd>联保网点</dd>
                    <dd>常见问题FAQ</dd>
                    <dd>订单查询</dd>
                    <dd>下载专区</dd>
                </dl>
                <dl>
                    <dt>关于我们</dt>
                    <dd>公司介绍</dd>
                    <dd>企业文化</dd>
                    <dd>工作机会</dd>
                    <dd>法律声明</dd>
                    <dd>联系我们</dd>
                </dl>
                <dl>
                    <dt>新闻中心</dt>
                    <dd>公司新闻</dd>
                    <dd>媒体报导</dd>
                    <dd>行业动态</dd>
                </dl>
                <dl>
                    <dt>常用链接</dt>
                    <dd>百度</dd>
                    <dd>Google</dd>
                    <dd>新浪微博</dd>
                </dl>
            </div>
        </footer>
        <div class="footer-bottom">
            <p>2011-2012版权所有 深圳市汇聚众合科技发展有限公司 （品牌：尚合-SAMHAVE） 服务热线：400-633-7922</p>
            <p>经营许可证编号：粤ICP备11077821号-1</p>
            <img src="./images/bottom_logo.png" alt="">
        </div>
    </div>
</body>

</html>